<template>
  <div class="reply-list">
    <ReplyItem
      v-for="reply in replies"
      :key="reply.id"
      :reply="reply"
      :root-comment-id="rootCommentId"
      @reply="handleReply"
    />
  </div>
</template>

<script setup lang="ts">
import ReplyItem from './ReplyItem.vue'
import type { FlatReply } from '../types/comment'

const {replies, rootCommentId} = defineProps<{
  replies: FlatReply[]
  rootCommentId: number
}>()

const emit = defineEmits<{
  (e: 'reply', data: any): void
}>()

// 处理回复
const handleReply = (data: any) => {
  emit('reply', data)
}
</script>

<style scoped>
.reply-list {
  display: flex;
  flex-direction: column;
  margin-left: 52px;
  margin-top: 16px;
}
</style>
